<template>
  <a-card>
    <a-row :gutter="20">
      <a-col :span="4">
        <a-divider orientation="left">部门信息树</a-divider>
        <unit-tree @changeSelect="unitTreeChangeSelect" :edit-tree="false"></unit-tree>
      </a-col>
      <a-col :span="20">
        <a-divider orientation="left">用户信息</a-divider>
        <page-table
          v-if="queryParam.unitId"
          rowKey="userId"
          :ref="pageTableRef"
          :query-api="user_queryPageApi"
          :query-param="queryParam"
          :showAddButton="false"
          :showDeleteButton="false"
          :columns="columns"
          :search-data="searchData"
        >
          <template #customUserSexDesc="{text}">
            <a-tag :color="text=='男'?'#87d068':'#f50'">{{text}}</a-tag>
          </template>
          <template #customUserBrithday="{text}">
            <span>{{text |formatDateString('YYYY-MM-DD')}}</span>
          </template>
        </page-table>
      </a-col>
    </a-row>
  </a-card>
</template>
<script>
import UnitTree from "@/views/org/user/component/unitTree";
import { user_queryPageApi } from "@/api/org/user";
const columns = [
  {
    title: "用户账号",
    dataIndex: "userAccount",
    sorter: true
  },
  { title: "用户姓名", dataIndex: "userName" },
  { title: "用户电话", dataIndex: "userPhone" },
  { title: "用户邮箱", dataIndex: "userEmail" },
  {
    title: "用户性别",
    dataIndex: "userSexDesc",
    scopedSlots: { customRender: "customUserSexDesc" }
  },
  {
    title: "用户生日",
    dataIndex: "userBrithday",
    scopedSlots: { customRender: "customUserBrithday" },
    hidden: true
  }
];
//搜索数据
const searchData = [
  { type: "input", name: "userAccount", label: "用户账号" },
  { type: "input", name: "userName", label: "用户姓名" },
  { type: "input", name: "userPhone", label: "用户电话" },
  { type: "input", name: "userEmail", label: "用户邮箱" },
  {
    type: "dictionarySelect",
    name: "userSex",
    codeItemId: "ORG_USER_SEX",
    label: "用户性别"
  },
  { type: "date", name: "userBrithday", label: "用户生日" }
];
export default {
  components: { UnitTree },
  props: {
    //当前部门id
    currentUnitId: {
      type: String
    },
    //需要排除的角色id
    excludeRoleId: {
      type: String
    }
  },
  data() {
    return {
      columns,
      searchData,
      user_queryPageApi,
      pageTableRef: "selectUserPageTable",
      queryParam: {
        unitId: undefined,
        excludeUnitId: this.currentUnitId, //排除当前部门已经关联的用户
        excludeRoleId: this.excludeRoleId //排除当前角色已经关联的用户
      }
    };
  },
  methods: {
    unitTreeChangeSelect(selectKey, selectData) {
      if (this.queryParam.unitId) {
        this.queryParam.unitId = selectKey;
        this.$refs[this.pageTableRef].reload();
        return;
      }
      this.queryParam.unitId = selectKey;
    },
    //得到选中的用户id
    getSelectUserIds() {
      return this.$refs[this.pageTableRef].getSelectRowKeys();
    }
  }
};
</script>
